@import "../../../style/color.scss";
@import "../../../style/domain.scss";
@import "../../../style/font.scss";
@import "../../../style/mixin.scss";

// 预警规则修改的css
.alert-rule-page {

  .btn-wrap {
    text-align: right;
    margin-top: 20px;
  }

  .charts-wrap {
    margin-top: 40px;

    .chart-item {
      display: inline-block;
      width: 50%;

      &:first-child {
        padding-right:33px;
      }

      &:not(:first-child) {
        padding-left: 33px;
      }


      .chart {
        width: 100%;
        height: 100%;
        background: url("./../../../../images/page/alert_bg.png") no-repeat;
        background-size: 100% 100%;


        .title {
          font-family: $regular-font-family;
          font-size: 24px;
          color: #FFFFFF;
          letter-spacing: 0;
          text-shadow: 0 0 4px rgba(255,255,255,0.50);
          text-align: center;
          position: relative;
          top: -20px;
        }

        .ant-chart {
          width: 100%;
          height: 512px;
          color: #ffffff;
          text-align: center;

        }

      }
    }
  }

}

.label {
  color: #ffffff;
}

@mixin modal() {
  background-size: 263px 100%;
  border: none;
  padding: 28px 32px;
}

//添加预警规则modal
.add-alert-rule-modal.ant-modal {
  top: 40px;

  .ant-form .ant-form-item {
    padding: 0 60px;
  }
  .ant-form .ant-form-item .ant-input {
      width: 260px;
  }

  .select {
    width: 260px!important;
    height: 40px;
  }
  .ant-select-selection--single {
    height: 40px;
  }

  .ant-select-selection__rendered {
    line-height: 40px;
    font-size: 18px;
  }

  .day {
    color: #ffffff;
    display: inline-block;
    padding-left: 10px;
  }

  .ant-form-item-label {
    width: 230px;
    margin-right: 20px;
  }

  ::-webkit-input-placeholder { /* WebKit browsers */
    color: $search-input-color;
  }
  :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: $search-input-color;
  }
  ::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: $search-input-color;
  }
  :-ms-input-placeholder { /* Internet Explorer 10+ */
    color: $search-input-color;
  }

  .form {
    display: table-cell;
    vertical-align: top;
  }

  .chart {
    display: table-cell;
    width: 450px;
    vertical-align: middle;
  }

  .ant-modal-content {
    background:
      url("./../../../../images/page/alert_modal_l.png") no-repeat top left,
      url("./../../../../images/page/alert_modal_r.png") no-repeat top right;
    @include modal();
  }
}

//添加机构预警规则
.add-organize-modal {
  .ant-form-item-label {
    width: 120px;
    margin-right: 20px;
  }

  .ant-modal-content .ant-modal-body {
      padding-left: 120px;
  }
}


// 新ui页码
.new-pagination-wrap {
  text-align: center;
  padding-top: 40px;

  > div > div {
    display: inline-block;
    width: 38px;
    height: 38px;
    margin: 0 72px;
    cursor: pointer;
  }

  .pre-btn {
    background: url("./../../../../images/page/icon_back_normal.png") no-repeat 100% 100%;

    &:hover {
      background: url("./../../../../images/page/icon_back_light.png") no-repeat 100% 100%;
    }
  }

  .next-btn {
    background: url("./../../../../images/page/icon_next_normal.png") no-repeat 100% 100%;

    &:hover {
      background: url("./../../../../images/page/icon_next_light.png") no-repeat 100% 100%;
    }
  }

  span {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    margin: 0 10px;
    cursor: pointer;
    vertical-align: 50%;
  }

  .normal-page {
    background-color: #ffffff;
  }

  .active-page {
    background-color: $pagination-active-bg;
  }

}

// 小modal边框
.small-modal.ant-modal {
  min-width: 800px;

  .ant-modal-content {
    background:
      url("./../../../../images/page/small_modal_l.png") no-repeat top left,
      url("./../../../../images/page/small_modal_r.png") no-repeat top right;
    @include modal();

    .ant-modal-body {
      min-height: 430px;
    }
  }
}

// 中modal边框
.middle-modal.ant-modal {

  .ant-modal-content {
    background:
      url("./../../../../images/page/middle_modal_l.png") no-repeat top left,
      url("./../../../../images/page/middle_modal_r.png") no-repeat top right;
    @include modal();
  }
}

// 大modal边框1
.big-modal1.ant-modal {

  .ant-modal-content {
    background:
      url("./../../../../images/page/alert_modal_l.png") no-repeat top left,
      url("./../../../../images/page/alert_modal_r.png") no-repeat top right;
    @include modal();
  }
}
